Google
youtube
We will build a JavaScript web app that takes in some text and does TTS as well as the option to select a language to translate to. We will use the Vercel CLI and a serverless function fot the translation and API KEY security. Tailwind CSS for styling.
Final Code:
For more Vanilla JS projects, check out these courses:
20 Vanilla JS Projects:
Modern JS From the Beginning:
50 Projects In 50 Days:
Timestamps:
0:00 - Intro
2:22 - Project Structure
4:38 - HTML & Tailwind Classes
8:32 - Web Speech API & TTS
11:10 - Get Voices
16:20 - Language Selection
20:06 - Google Translate API Key Setup
21:29 - Vercel CLI Setup
23:57 - Creating a Serverless Function
26:57 - dotenv Setup
29:22 - Google Translate API Request
32:58 - Test Function With Postman
34:18 - Make Request To Serverless Function Endpoint
38:39 - Translate Text & Play TTS
43:21 - Deploy To Vercel
|
2025/01/20
youtube
